@import url('./config.less');
.DevRed{color:#f00}
.DevBlue{color:#00f}

.text-red{color:#F56C6C;}
.text-yellow{color:#E6A23C;}
.text-green{color:#67C23A;}
.text-blue{color:#409eff;}
.text-gray{color:#909399;}


.sup{position: absolute;left:0;top:-12px;}
.sub{position: absolute;left:0;bottom:-12px;}
.addScrollbar(){
  &::-webkit-scrollbar{
      width: 5px;
  }//滚动条整体部分，必须
  &::-webkit-scrollbar-thumb{
    border-radius: 10px;
    background-color: #bbb;
  }//滚动条里面的小方块，能向上向下移动（或向左向右移动）
  &::-webkit-scrollbar-track{
    background-color:rgba(255,255,255,0);
  }//滚动条的轨道（里面装有Thumb）
  &::-webkit-scrollbar-button{
    width:0;height:0;
  }//滚动条的轨道的两端按钮，由于通过点击微调小方块的位置。
  &::-webkit-scrollbar-track-piece{

  }//内层轨道，滚动条中间部分
  &::-webkit-scrollbar-corner{

  }//边角，即垂直滚动条和水平滚动条相交的地方
  &::-webkit-resizer{

  }//两个滚动条的交汇处上用于拖动调整元素大小的小控件
}
.panel(@HH:0,@FH:0){
  height:100%;
  background-color:#fff;
  &-header{
    position: absolute;
    top:0;left:0;right:0;
    height:@HH;
    padding:0 unit(@defPadding,px);
  }
  &-body{
    position: absolute;
    top:@HH;bottom:@FH;
    left:0;right:0;
    overflow: auto;
    .addScrollbar();
  }
  &-footer{
    position: absolute;
    bottom:0;left:0;right:0;
    height:@FH;
  }
}
body{
  color:@defFontColor;
}
.btn{
  cursor: pointer;
  &+.btn{margin-left:12px;}
  &-font16{
    font-size:16px;
    /deep/.el-checkbox__label{
      font-size:inherit !important;
    }
  }
  &-primary{color:#1890FF;}
  &-danger{color:#F5222D;}
}

.el-notification__group{
  position: static;
}

.el-date-picker__time-header{
  z-index:1000 !important;
}

.el-image-viewer__btn{
  z-index:7;
}

.winClass{
  width:auto;
  padding:0;
  border:none;
  background:none;
  box-shadow:none;
}

// .vue-contextmenu-listWrapper{
//   .context-menu-list{
//     padding:5px;
//     .btn-wrapper-simple{
//       line-height:20px;
//       padding:5px;
//     }
//     .no-child-btn{
//       padding:0;
//     }
//     .nav-name-right{}
//   }
// }

.el-button--primary.is-plain:focus,
.el-button--primary.is-plain:hover{
  background-color:lighten(@blue,30%);
  border-color:lighten(@blue,30%);
  color:color(@blue);
}

.el-button{
  // &:hover{
  //   background-color:lighten(@blue,42%);
  //   border-color:lighten(@blue,30%);
  //   color:color(@blue);
  // }
  &.open{
    @red:color(#F5222D);
    border-color:@red;
    background-color:lighten(@red,40%);
    color:@red;
  }
  &.active{
    background-color:lighten(@blue,0%);
    color:#fff;
    &:hover,
    &:focus{
      background-color:lighten(@blue,0%);
      color:#fff;
    }
  }
  
}